<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>北海风貌</title>

    <!-- Bootstrap -->
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet">
    <link href="./css/bh_map.css" rel="stylesheet">
    <link href="./css/common.css" rel="stylesheet">
    <link href="//at.alicdn.com/t/font_902790_g8dm7878bt.css" rel="stylesheet">
</head>
<body>
<div class="page">
    <!-- 头部 -->
    <div class="zs-header-body">
        <div class="zs-header container">
            <div class="pull-left zs-header-logo">
                <span>北海市招商资源网</span>
            </div>
            <div class="pull-right">
                <ul class="zs-header-menu">
                    <li><a href="index2.html">首页</a></li>
                    <li><a href="list.html?categoryId=21">招商政策</a></li>
                    <li><a href="list.html?categoryId=31">产业信息</a></li>
                    <li><a href="bh_map.html" class="zs-header-active" >北海风貌</a></li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 头部 -->

    <!-- banner -->
    <div class="zs-banner">
        <img src="img/banner.jpg" alt="">
    </div>
    <!-- banner -->

    <div class="content">
        <div class="container">
            <div class="map_title">北海风貌</div>
            <div class="map-content">
                <img src="./img/bh_map.jpg" alt="">
                <!--北海工业园区-->
                <div class="position-remark-1 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--北海工业园区-->

                <!--广西合浦工业园区-->
                <div class="position-remark-2 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--广西合浦工业园区-->

                <!--铁山东港工业园-->
                <div class="position-remark-3 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--铁山东港工业园-->

                <!--北海市铁山港工业园-->
                <div class="position-remark-4 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--北海市铁山港工业园-->

                <!--北海出口加工区-->
                <div class="position-remark-5 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--北海出口加工区-->

                <!--广西北海国家海洋农业科技园-->
                <div class="position-remark-6 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--广西北海国家海洋农业科技园-->

                <!--北海国家高新技术产业开发园-->
                <div class="position-remark-7 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--北海国家高新技术产业开发园-->

                <!--涠洲岛旅游区-->
                <div class="position-remark-8 map-spot">
                    <button type="button" class="btn btn-default" data-container="body" data-trigger="hover" data-toggle="popover" data-placement="top"
                            data-content="地区介绍">
                    </button>
                </div>
                <!--涠洲岛旅游区-->
            </div>
        </div>

    </div>

    <!-- 底部 -->
    <footer>
        <div class="container">
            <ul>
                <li>
                    <span>单位概况</span>
                    <a href="">单位介绍</a>
                </li>
                <li>
                    <span>单位推荐</span>
                    <a href="">单位介绍</a>
                </li>
                <li>
                    <span>联系方式</span>
                    <div class="contact">
                        <p>电话：1888888888</p>
                        <p>邮箱：999999999@qq.com</p>
                        <p>地址：北海市海城区北海大道</p>
                    </div>
                </li>
                <li>
                    <span>关注公众号</span>
                    <div class="qrcode">
                        <img src="img/qrcode.gif" alt="">
                    </div>
                </li>
                <li>
                    <span>其他</span>
                    <div class="other-service">
                        <div>投资服务</div>
                        <div>在线调查</div>
                        <div>政府咨询</div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="record">
            <div class="container">
                <div class="pull-left">北海市招商局 备案号：沪ICP备17052208号</div>
                <div class="pull-right">北海市招商资源网</div>
            </div>
        </div>
    </footer>
    <!-- 底部 -->
</div>

<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="js/jquery.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="js/jQuery-jcMarquee.js"></script>
<script>
    $(function () {
        $('#Marquee_x').jcMarquee({'marquee': 'x', 'margin_right': '10px', 'speed': 30});
        // DIVCSS5提示：10px代表间距，第二个20代表滚动速度
        $(function () {
            $('[data-toggle="popover"]').popover()
        })
    });
</script>
</body>
</html>